<template>
  <div class="dashboard-editor-container">
    <el-row>
      <el-col :span="4">
        <div class="button" @click="goBatchReport">
          <div class="button-icon">
            <i class="el-icon-eleme"></i>
          </div>
          <div class="button-text">通用报工</div>
        </div>
      </el-col>
      <el-col :span="4">
        <div class="button" @click="goSerialReport" style="background: rgb(63,94,251); background: radial-gradient(circle, rgba(63,94,251,1) 0%, rgba(252,70,107,1) 100%);">
          <div class="button-icon">
            <i class="el-icon-eleme"></i>
          </div>
          <div class="button-text">流水线报工</div>
        </div>
      </el-col>
      <el-col :span="4"></el-col>
      <el-col :span="4"></el-col>
    </el-row>
  </div>
</template>

<script>
import PanelGroup from './dashboard/PanelGroup'
import LineChart from './dashboard/LineChart'
import RaddarChart from './dashboard/RaddarChart'
import PieChart from './dashboard/PieChart'
import BarChart from './dashboard/BarChart'


export default {
  name: 'Index',
  components: {
    PanelGroup,
  },
  data() {
    return {

    }
  },
  methods: {
    /* 跳转到装配报工页面 */
    goBatchReport(){
      this.$router.push('/mes/report/batch')
    },
    goSerialReport() {
      this.$router.push('/mes/report/serial')
    }

  }
}
</script>

<style lang="scss" scoped>
.dashboard-editor-container {
  padding: 32px;
  background-color: #fff;
  position: relative;
  .title {
    font-size: 18px;
  }
  .button {
    width: 200px;
    height: 100px;
    border-radius: 15px;
    background: rgb(31,219,238);
    background: linear-gradient(90deg, rgba(31,219,238,0.9724264705882353) 0%, rgba(11,240,199,1) 46%, rgba(0,202,255,1) 100%);
    box-shadow:  20px 20px 60px #bebebe, -20px -20px 60px #ffffff;
    text-align: center;
    .button-icon {
      font-size: 40px;
      color: #fff;
      height: 60px;
      line-height: 60px;
    }
    .button-text {
      font-family: arial, sans-serif;   /*字体*/
      font-size: 18px;   /*字体大小*/
      letter-spacing: 1.5pt;   /*字体间距*/
      color: #fff;
      font-weight: bold;
      height: 40px;
    }
  }


}
</style>
